neon
noir
high-contrast
modern
emotional depth
immersive experience
future-forward
vibrant accents
dark mode
light mode
user comfort
functional design
Shadcn/ui Theme Css Variables
name: Neon Noirkeyword: Material Darker views: 4
:root {
--background: 210 15% 98%;
--foreground: 210 10% 10%;
--card: 210 15% 95%;
--card-foreground: 210 10% 20%;
--popover: 210 15% 95%;
--popover-foreground: 210 10% 20%;
--primary: 280 60% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 180 50% 40%;
--secondary-foreground: 0 0% 100%;
--muted: 210 10% 90%;
--muted-foreground: 210 10% 50%;
--accent: 0 70% 50%;
--accent-foreground: 0 0% 100%;
--destructive: 10 90% 50%;
--destructive-foreground: 0 0% 100%;
--border: 210 15% 85%;
--input: 210 15% 90%;
--ring: 280 60% 50%;
--radius: 0.75rem;
--chart-1: 280 60% 50%;
--chart-2: 180 50% 40%;
--chart-3: 0 70% 50%;
--chart-4: 10 90% 50%;
--chart-5: 210 60% 50%;
}
.dark {
--background: 210 10% 10%;
--foreground: 210 15% 95%;
--card: 210 10% 15%;
--card-foreground: 210 15% 95%;
--popover: 210 10% 15%;
--popover-foreground: 210 15% 95%;
--primary: 280 60% 50%;
--primary-foreground: 0 0% 100%;
--secondary: 180 50% 40%;
--secondary-foreground: 0 0% 100%;
--muted: 210 10% 20%;
--muted-foreground: 210 15% 70%;
--accent: 0 70% 50%;
--accent-foreground: 0 0% 100%;
--destructive: 10 90% 50%;
--destructive-foreground: 0 0% 100%;
--border: 210 10% 25%;
--input: 210 10% 20%;
--ring: 280 60% 50%;
--radius: 0.75rem;
--chart-1: 280 60% 50%;
--chart-2: 180 50% 40%;
--chart-3: 0 70% 50%;
--chart-4: 10 90% 50%;
--chart-5: 210 60% 50%;
}